<template>
    <div>
        <div class="photo">
            <p> <img src="@/assets/1a36b08f7bcd18da601176ff465dff2.png"></p>
            <p>趣易购</p>
        </div>


        <van-form @submit="onSubmit" style="padding: 0 20px;">
            <van-field v-model="username" username="用户名" name="username" placeholder="请输入测试账号user123" />
            <van-field v-model="password" type="password" name="password" placeholder="请输入测试密码user123" />
            <p class="fled"><div style="float: left;  width: 50%; text-align: left;"> 免费注册</div><div style="float: left; width: 50%; text-align: right;">忘记密码</div></p>
            <div style="margin-top: 50px;">
                <van-button round block type="info" native-type="submit" class="submit">提交</van-button>
            </div>
        </van-form>
    </div>
</template>
<script>
import { login } from "@/api/index";
export default {
    name: "login",
    data() {
        return {
            username: '',
            password: '',
        }
    },
    methods: {
        onSubmit(values) {
            console.log('submit', values);
            login(values).then((res) => {
                console.log(res.data);
                console.log(res.data.token);
                localStorage.setItem('token', res.data.data.token);
                localStorage.setItem('userInfo', JSON.stringify(res.data.data.userInfo));
                var add=localStorage.getItem("active")
                console.log(add)
                this.$router.push({ path: add });
            })
        },
    },
    mounted() {

    }
}
</script>
<style lang="scss">
.photo {
    width: 100%;
    height: 100px;
    // border: 1px solid red;
    text-align: center;
    padding: 20px 0;

    p {
        margin: 0;
    }
}
.van-field {
    border: 1px solid gray;
    margin: 16px 5px;
    border-radius: 5px;
    height: 40px;
}

.submit {
    background-color: #DB3D3C;
    border: none;
    width: 100%;
    border-radius: 5px;
    margin-top: 20px;
}

input::-webkit-input-placeholder {
    // color: black !important;
}

</style>